import React, { Component } from 'react'
import styles from './index.module.css'
export default class Swiper extends Component {
    state= {
        imgSrc: ['image01.webp','image02.webp','image03.webp','image04.webp','image05.webp'],
        index: 1
    }
    render() {
        let {index, imgSrc} = this.state
        return (
        <div className={styles.swiperBox}>
            <img className={styles.imgBox} src={require(`../../assests/images/${imgSrc[index]}`)} alt="" />
            <span onClick={() => {
                 index --
                 if(index < 0) {
                     index = imgSrc.length -1
                 }
                 this.setState({
                     index: index
                 })
            }}>&lt;</span>
            <span className={styles.rightBtn} onClick={() => {
                index ++
                if(index > imgSrc.length-1) {
                    index = 0
                }
                this.setState({
                    index: index
                })
            }}>&gt;</span>

        </div>
        )
    }
}
